import React, { useState, Dispatch, SetStateAction } from "react";
import ReactDOM from "react-dom";
import Modal from "./Modal";

let visible: boolean;
let setVisible: Dispatch<SetStateAction<any>>;

const Login = (props: any) => {
  [visible, setVisible] = useState(false);
  const { onSuccess, onFail } = props;
  return (
    <Modal {...props} visible={visible} onCancel={() => setVisible(false)}>
      <form>
        <label>用户名</label>
        <input></input>
        <br />
        <label>密码</label>
        <input></input>
      </form>
    </Modal>
  );
};

let container: HTMLDivElement;

export function open(props: any) {
  if (!container) {
    container = document.createElement("div");
    document.body.appendChild(container);
    ReactDOM.render(<Login container={container} {...props} />, container);
  }
  setVisible(true);
}

export function close() {
  if (setVisible) {
    setVisible(false);
  }
}
